<template>
    <div style="width: 80vw">
        <div id="hader">
            <div>顾客点评</div>
        </div>
        <div>
            <el-table
                    :data="tableData"
                    stripe
                    style="width: 100%">
                <el-table-column
                        prop="a"
                        label="点评顾客"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="b"
                        label="服务等级"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="c"
                        label="顾客联系电话">
                </el-table-column>
                <el-table-column
                        prop="d"
                        label="服务员">
                </el-table-column>
                <el-table-column
                        prop="e"
                        label="点评时间">
                </el-table-column>
                <el-table-column label="操作">
                    <template slot-scope="scope">
                        <el-button
                                size="mini"  @click="handleDelete(scope.row),dialogVisible = true">查看评论</el-button>
                    </template>
                </el-table-column>

            </el-table>
        </div>
        <!--        分页-->
        <div style="text-align: center">
            <!--            <el-pagination-->
            <!--                    @size-change="selectAll"-->
            <!--                    @current-change="selectAll"-->
            <!--                    :current-page.sync="yhkBo.page.current"-->
            <!--                    :page-size.sync="yhkBo.page.size"-->
            <!--                    :page-sizes="[3, 6]"-->
            <!--                    layout="total, prev, pager, next,sizes"-->
            <!--                    :total="$store.state.dataTotal">-->
            <!--            </el-pagination>-->
        </div>
        <el-dialog
                title="评论详情"
                :visible.sync="dialogVisible"
                width="60%"
                :before-close="handleClose">


            <div>{{this.pinglun}}</div>


            <el-button type="primary" style="margin-left: 1000px;margin-top: 20px" @click="dialogVisible = false">关闭</el-button>
        </el-dialog>
    </div>
</template>

<script>
    export default {
        name: "DianPing",
        data(){
            return{
                dialogVisible:false,
                tableData:[{
                    a:"aa",
                    b:"bb",
                    c:"cc",
                    d:"dd",
                    e:"ee",
                    f:1,
                    g:"你们家麻辣烫真好吃"
                },],
                pinglun:''
            }
        },methods:{
            handleDelete(row){
                this.pinglun=row.g;

            },
            handleClose(done) {
                done();
            }
        }
    }
</script>

<style scoped>
    #hader{
        background-color: #ffffff;
        border: 1px solid #eeeeee;
        border-radius: 3px;
        overflow: hidden;
        height: 60px;
        line-height: 60px;
        box-shadow: inset 1px 1px 1px 1px #eeeeee;
        text-align: center;

    }
    #hader div{
        size: 14px;
        cursor: pointer;
        color: #cccccc;
        font-weight: bold;
    }
</style>